﻿@model DHQGHN.PM2.Models.ChiTieuModel

@{
    var danhSachCap = new List<SelectListItem>(){
        new SelectListItem{
            Value = "",
            Text = "--- Chọn cấp chỉ tiêu ---"
        },
        new SelectListItem{
            Value = "1",
            Text = "Chỉ tiêu cấp 1"
        },
        new SelectListItem{
            Value = "2",
            Text = "Chỉ tiêu cấp 2"
        },
        new SelectListItem{
            Value = "3",
            Text = "Chỉ tiêu cấp 3"
        }
    };
}

@*@Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")*@

@using (Html.BeginForm("ActionSave", "ChiTieu", FormMethod.Post, new { @id = "frmChiTieu" }))
{
    <div class="row">
        <div class="col-md-12">
            <fieldset id="fs1" class="fs_group1" style="border-style:hidden;">
                @Html.HiddenFor(m => m.ChiTieuId)
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3" style="">
                        @Html.Label("Cấp")
                        <font size="3" color="red" style="display:inline;" class="pm2-hidden">*</font>
                    </div>
                    <div class="col-md-9" style="margin-bottom: 10px;">
                        @if (ViewBag.IsUpdate)
                        {
                            @Html.DropDownListFor(m => m.Cap, danhSachCap as List<SelectListItem>,
                            null, new { @class = "form-control input-sm", disabled = "disabled" })                           
                        }
                        else
                        {
                            @Html.DropDownListFor(m => m.Cap, danhSachCap as List<SelectListItem>,
                            null, new { @class = "form-control input-sm", @onchange = "onCap_change()" })
                            
                        }
                        <span style="color: red;">
                            @Html.ValidationMessageFor(m => m.Cap)
                        </span>
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3" style="">
                        @Html.Label("Cấp 1")
                        <font size="3" color="red" style="display:inline;" class="pm2-hidden">*</font>
                    </div>
                    <div class="col-md-9" style="margin-bottom: 10px;">
                        @if (ViewBag.IsUpdate)
                        {
                            if (Model.Cap == 2 || Model.Cap == 3)
                            {
                                @Html.DropDownListFor(m => m.MaCap1, ViewBag.DanhSachChiTieuCap1 as List<SelectListItem>,
                                                      new { @id = "TenChiTieuCap1", @class = "form-control input-sm", @onchange = "onChiTieuCap1_change()", @disabled = "disabled" })
                            }
                            else
                            {
                                @Html.DropDownListFor(m => m.MaCap1, ViewBag.DanhSachChiTieuCap1 as List<SelectListItem>,
                                                 new { @id = "TenChiTieuCap1", @class = "form-control input-sm", @onchange = "onChiTieuCap1_change()", @disabled = "disabled" })
                            }
                        }
                        else
                        {
                            @Html.DropDownListFor(m => m.MaCap1, ViewBag.DanhSachChiTieuCap1 as List<SelectListItem>,
                                                 new { @id = "TenChiTieuCap1", @class = "form-control input-sm", @onchange = "onChiTieuCap1_change()", @disabled = "disabled" })
                        }
                        <span style="color: red;">
                            @Html.ValidationMessageFor(m => m.TenChiTieuCap1)
                        </span>
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3">
                        @Html.LabelFor(m => m.TenChiTieuCap2, new { @class = "text-center", style = "" })
                        <font size="3" color="red" style="display:inline;" class="pm2-hidden">*</font>
                    </div>
                    <div class="col-md-9">
                        @if (ViewBag.IsUpdate)
                        {
                            if (Model.Cap == 3)
                            {
                                @Html.DropDownListFor(m => m.MaCap2, ViewBag.DanhSachChiTieuCap2 as List<SelectListItem>,
                                                          new { @id = "TenChiTieuCap2", @class = "form-control input-sm", @onchange = "onChiTieuCap2_change()", @disabled = "disabled" })
                            }
                            else
                            {
                                @Html.DropDownListFor(m => m.MaCap2, ViewBag.DanhSachChiTieuCap2 as List<SelectListItem>,
                                                     new { @id = "TenChiTieuCap2", @class = "form-control input-sm", @onchange = "onChiTieuCap2_change()", @disabled = "disabled" })
                            }
                        }
                        else
                        {
                            @Html.DropDownListFor(m => m.MaCap2, ViewBag.DanhSachChiTieuCap2 as List<SelectListItem>,
                                                     new { @id = "TenChiTieuCap2", @class = "form-control input-sm", @onchange = "onChiTieuCap2_change()", @disabled = "disabled" })
                        }
                        <span style="color: red;">
                            @Html.ValidationMessageFor(m => m.TenChiTieuCap2)
                        </span>
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3">
                        @Html.LabelFor(m => m.TenChiTieu, new { @class = "text-center", style = "" })
                        <font size="3" color="red" style="display:inline;" class="pm2-hidden">*</font>
                    </div>
                    <div class="col-md-9">
                        @Html.TextBoxFor(m => m.TenChiTieu, new { @class = "form-control  ", @autofocus = "autofocus", style = ""})
                        <span style="color: red;">
                            @Html.ValidationMessageFor(m => m.TenChiTieu)
                        </span>
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3">
                        @Html.LabelFor(m => m.DonViTinh, new { @class = "text-center", style = "" })
                        <font size="3" color="red" style="display:inline;" class="pm2-hidden">*</font>
                    </div>
                    <div class="col-md-9">
                        @Html.TextBoxFor(m => m.DonViTinh, new { @class = "form-control  ", @autofocus = "autofocus", style = "", @maxlength = 50 })
                        <span style="color: red;">
                            @Html.ValidationMessageFor(m => m.DonViTinh)
                        </span>
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3">

                    </div>
                    <div class="col-md-9">
                        @*@Html.CheckBox("LaChiTieuAo", false, new { @id = "LaChiTieuAo", @class = "", style = "" })*@
                        @if (Model.LaChiTieuAo == 1)
                        {
                            <input type="checkbox" id="LaChiTieuAo" checked />
                        }
                        else
                        {
                            <input type="checkbox" id="LaChiTieuAo" />
                        }
                        @Html.LabelFor(m => m.LaChiTieuAo, new { @class = "text-center", style = "" })
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3">

                    </div>
                    <div class="col-md-9">
                        @if (Model.ChoPhepTinhTong == 1)
                        {
                            <input type="checkbox" id="ChoPhepTinhTong" checked />
                        }
                        else
                        {
                            <input type="checkbox" id="ChoPhepTinhTong" />
                        }

                        @Html.LabelFor(m => m.ChoPhepTinhTong, new { @class = "text-center", style = "" })
                        @*@Html.CheckBox("ChoPhepTinhTong", true, new { @id = "ChoPhepTinhTong", @class = "", style = "" })*@

                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="col-md-3">
                        <h5>@Html.LabelFor(mode => mode.GhiChu, new { @class = "text-center", style = "" })</h5>
                        <font size="3" style="display: inline; vertical-align: top; visibility:hidden;">*</font>
                    </div>
                    <div class="col-md-9">
                        @Html.TextAreaFor(m => m.GhiChu, new { @class = "form-control", @rows = 5, style = "" })
                    </div>
                </div>

            </fieldset>
        </div>
    </div>
}

@Scripts.Render("~/bundles/jqueryval")

<script>
    @functions{
            public string GetAntiForgeryToken()
            {
                string cookieToken, formToken;
                AntiForgery.GetTokens(null, out cookieToken, out formToken);
                return cookieToken + "," + formToken;
            }
        }
</script>
<script>
    function disableDanhSachChiTieu(id) {
        $("#" + id).attr("disabled", "disabled");
    }

    function enableDanhSachChiTieu(id) {
        $("#" + id).removeAttr("disabled");
    }
    function onCap_change() {
        var cap = $("#Cap").val();
        if (cap == "") {
            setDefaultValue('TenChiTieuCap1', '--- Chọn chỉ tiêu cấp 1 ---', "");
            setDefaultValue('TenChiTieuCap2', '--- Chọn chỉ tiêu cấp 2 ---', "");
            disableDanhSachChiTieu("TenChiTieuCap1");
            disableDanhSachChiTieu("TenChiTieuCap2");
        }
        else if (cap == '1') {
            setDefaultValue('TenChiTieuCap1', '--- Chọn chỉ tiêu cấp 1 ---', "-1");
            setDefaultValue('TenChiTieuCap2', '--- Chọn chỉ tiêu cấp 2 ---', "-1");
            disableDanhSachChiTieu("TenChiTieuCap1");
            disableDanhSachChiTieu("TenChiTieuCap2");
        }
        else if (cap == '2') {
            enableDanhSachChiTieu("TenChiTieuCap1");
            disableDanhSachChiTieu("TenChiTieuCap2");
            setDefaultValue('TenChiTieuCap2', '--- Chọn chỉ tiêu cấp 2 ---', "-1");
            setChiTieuCap1();
        }
        else if (cap == '3') {
            var chiTieuCap1 = $('#TenChiTieuCap1');
            var chiTieuCap2 = $('#TenChiTieuCap2');
            chiTieuCap1.empty();
            chiTieuCap2.empty();
            setChiTieuCap1();
            setDefaultValue('TenChiTieuCap1', '--- Chọn chỉ tiêu cấp 1 ---', "");
            setDefaultValue('TenChiTieuCap2', '--- Chọn chỉ tiêu cấp 2 ---', "");
            enableDanhSachChiTieu("TenChiTieuCap1");
            disableDanhSachChiTieu("TenChiTieuCap2");
        }

    }

    function onChiTieuCap1_change() {
        var cap = $('#Cap').val();
        var maCap1 = $('#TenChiTieuCap1').val();
        if (cap == '3') {
            $('#TenChiTieuCap2').removeAttr("disabled");
            enableDanhSachChiTieu("TenChiTieuCap2");
            $.ajax({
                url: '@Url.Action("GetJsonChiTieuByMaCap1AndCap")',
                type: 'post',
                data: {
                    maCap1: maCap1,
                    cap: 2
                },
                success: function (result) {
                    var parent = $('#TenChiTieuCap2');
                    parent.html("");
                    parent.append(
                      $('<option>', {
                          value: "",
                          text: "--- Chọn chỉ tiêu cấp 2 ---"
                      }, '<option/>'));
                    $.each(result, function (i, item) {
                        parent.append(
                            $('<option>', {
                                value: item.MaCap2,
                                text: item.TenChiTieuCap2
                            }, '<option/>'));
                    });
                }
            });
        }
    }

    function onChiTieuCap2_change() {

    }

    function setDefaultValue(id, caption, val) {
        var parent = $('#' + id);
        parent.html('');
        parent.append(
                $('<option>', {
                    value: val,
                    text: caption
                }, '<option/>'));
    }

    function setChiTieuCap1() {
        $.ajax({
            url: '@Url.Action("GetJsonChiTieuByCap")',
            type: 'post',
            data: {
                cap: 1
            },
            success: function (result) {
                var parent = $('#TenChiTieuCap1');
                parent.html("");
                parent.append(
                       $('<option>', {
                           value: "",
                           text: "--- Chọn chỉ tiêu cấp 1 ---"
                       }, '<option/>'));

                $.each(result, function (i, item) {
                    parent.append(
                        $('<option>', {
                            value: item.MaCap1,
                            text: item.TenChiTieuCap1
                        }, '<option/>'));
                });
            }
        });
    }

    @*var $form = $("#certification-form");
    function save() {
        var result = false;
        if ($form.valid()) {
            $.ajax({
                type: "POST",
                url: $form.attr('action'),
                data: $form.serialize(),
                dataType: '',//chú ý là form đặc biệt thì phải điền trường này
                async: false,
                headers: {
                    'VerificationToken': '@GetAntiForgeryToken()'
                },
                success: function (response) {
                    if (response != null && response.status == 200) {
                        window.notice(response.result, window.notice_success);
                        OnCriteria(0);
                        result = true;
                    } else {
                        window.notice(response.result, window.notice_error);
                    }
                }
            });
        }
        return result;
    }*@

    //$('#NHOM_DON_VI_ID').change(function () {
    //    var nhomid = $('#NHOM_DON_VI_ID').val();
    //    $.ajax({
    //        dataType: "json",
    //        type: "POST",
    //        url: '/NguoiDungAdmin/GetDonViByNhom',
    //        contentType: "application/json",
    //        data: JSON.stringify({ strNhomDonViID: nhomid }),
    //        success: function (data) {
    //            var result = '';
    //            for (var i = 0; i < data.length; i++) {
    //                result += '<option value="' + data[i].Value + '">' + data[i].Text + '</option>';
    //            }
    //            $("#DON_VI_ID").html(result);
    //            //OnCriteria(0);
    //        }
    //    });
    //});
</script>
